From: Carlos Garnacho <carlosg@gnome.org>
Date: Mon, 21 Jan 2019 20:39:27 +0000 (+0100)
Subject: keyboard: Separate aspect ratio control to a container actor
X-Git-Tag: archive/raspbian/50.5-1+rpi1~1^2~897^2^2~25
X-Git-Url: https://dgit.raspbian.org/%22http://www.example.com/cgi/%22/%22http:/www.example.com/cgi/%22?a=commitdiff_plain;h=2a9923628bd2920115b3b0075c0752bcb425c6c0;p=gnome-shell.git

keyboard: Separate aspect ratio control to a container actor

This will be useful as we want other panels (eg. emoji) to preserve aspect
ratio with the rest of the OSK. Separate the aspect ratio management logic
into this container that will be the parent of them all.
---

diff --git a/js/ui/keyboard.js b/js/ui/keyboard.js
index e8de11657..f77c67870 100644
--- a/js/ui/keyboard.js
+++ b/js/ui/keyboard.js
@@ -54,6 +54,43 @@ const defaultKeysPost = [
       [{ width: 1.5, action: 'languageMenu', extraClassName: 'layout-key' }, { width: 1.5, action: 'hide', extraClassName: 'hide-key' }] ],
 ];
 
+var AspectContainer = GObject.registerClass(
+class AspectContainer extends St.Widget {
+    _init(params) {
+        super._init(params);
+        this._ratio = 1;
+    }
+
+    setRatio(relWidth, relHeight) {
+        this._ratio = relWidth / relHeight;
+        this.queue_relayout();
+    }
+
+    vfunc_allocate(box, flags) {
+        if (box.get_width() > 0 && box.get_height() > 0) {
+            let sizeRatio = box.get_width() / box.get_height();
+
+            if (sizeRatio >= this._ratio) {
+                /* Restrict horizontally */
+                let width = box.get_height() * this._ratio;
+                let diff = box.get_width() - width;
+
+                box.x1 += Math.floor(diff / 2);
+                box.x2 -= Math.ceil(diff / 2);
+            } else {
+                /* Restrict vertically */
+                let height = box.get_width() / this._ratio;
+                let diff = box.get_height() - height;
+
+                box.y1 += Math.floor(diff / 2);
+                box.y2 -= Math.floor(diff / 2);
+            }
+        }
+
+        super.vfunc_allocate(box, flags);
+    }
+});
+
 var KeyContainer = GObject.registerClass(
 class KeyContainer extends St.Widget {
     _init() {
@@ -97,32 +134,7 @@ class KeyContainer extends St.Widget {
         this._maxCols = Math.max(this._currentCol, this._maxCols);
     }
 
-    vfunc_allocate(box, flags) {
-        if (box.get_width() > 0 && box.get_height() > 0 && this._maxCols > 0) {
-            let keyboardRatio = this._maxCols / this._rows.length;
-            let sizeRatio = box.get_width() / box.get_height();
-
-            if (sizeRatio >= keyboardRatio) {
-                /* Restrict horizontally */
-                let width = box.get_height() * keyboardRatio;
-                let diff = box.get_width() - width;
-
-                box.x1 += Math.floor(diff / 2);
-                box.x2 -= Math.ceil(diff / 2);
-            } else {
-                /* Restrict vertically */
-                let height = box.get_width() / keyboardRatio;
-                let diff = box.get_height() - height;
-
-                box.y1 += Math.floor(diff / 2);
-                box.y2 -= Math.floor(diff / 2);
-            }
-        }
-
-        super.vfunc_allocate(box, flags);
-    }
-
-    layoutButtons() {
+    layoutButtons(container) {
         let nCol = 0, nRow = 0;
 
         for (let i = 0; i < this._rows.length; i++) {
@@ -149,6 +161,9 @@ class KeyContainer extends St.Widget {
             nRow += KEY_SIZE;
             nCol = 0;
         }
+
+        if (container)
+            container.setRatio(this._maxCols, this._rows.length);
     }
 });
 
@@ -679,6 +694,9 @@ var Keyboard = class Keyboard {
                        { x_align: St.Align.MIDDLE,
                          x_fill: false });
 
+        this._aspectContainer = new AspectContainer({ layout_manager: new Clutter.BinLayout() });
+        this.actor.add(this._aspectContainer, { expand: true, x_fill: true, y_fill: true });
+
         this._ensureKeysForGroup(this._keyboardController.getCurrentGroup());
         this._setActiveLayer(0);
 
@@ -736,8 +754,8 @@ var Keyboard = class Keyboard {
 
             this._loadRows(currentLevel, level, levels.length, layout);
             layers[level] = layout;
-            this.actor.add(layout, { expand: true });
-            layout.layoutButtons();
+            this._aspectContainer.add_child(layout);
+            layout.layoutButtons(this._aspectContainer);
 
             layout.hide();
         }